/*
* @Author: name
* @Date:   2018-07-14 16:22:25
* @Last Modified by:   name
* @Last Modified time: 2018-07-18 09:52:41
*/

'use strict';
window.onload = function(){
    var $ = function(id){
        return document.getElementById(id);
    }

    //生成随机数
    var ran = function(max,min){
        return Math.floor(Math.random()*(max-min+1)+min);
    }

    var tankM = ["enemy1","enemy2","enemy3"];
    var action = [87,65,83,68,32,0,0,0,0,0,0,0,0,83,87];  //键码对应上左下右以及空格,0位重复上个步骤
    var tankId = $("tankId");
    var timer;
    var levels = 1;             //关卡数
    tankId.name = "p1tank";                             //坦克名字
    tankId.position = 87;                               //坦克方向
    tankId.camp = 1;                                    //坦克阵营
    tankId.life = 3;                                    //坦克生命
    tankId.power = 1;                                   //坦克威力
    tankId.blood = 1;                                   //坦克血量
    tankId.condition = 1;                               //坦克状态
    tankId.cannon = 10;                                 //子弹数量
    //判断坦克移动方向
    function tankMove(tank,dire){
        switch(dire){
            //上移动
            case 87:
                tank.position = 87;
                tank.style.background = "url(./image/"+tank.name+"U.gif)";
                if(isTouch(tank)){
                    if(tank.offsetTop>0) tank.style.top = tank.offsetTop-10+"px";
                }
                break;
            //左移动
            case 65:
                tank.position = 65;
                tank.style.background = "url(./image/"+tank.name+"L.gif)";
                if(isTouch(tank)){
                    if(tank.offsetLeft>0) tank.style.left = tank.offsetLeft-10+"px";
                }
                break;
            //下移动
            case 83:
                tank.position = 83;
                tank.style.background = "url(./image/"+tank.name+"D.gif)";
                if(isTouch(tank)){
                    if(tank.offsetTop<540)tank.style.top = tank.offsetTop+10+"px";
                }
                break;
            //右移动
            case 68:
                tank.position = 68;
                tank.style.background = "url(./image/"+tank.name+"R.gif)";
                if(isTouch(tank)){
                     if(tank.offsetLeft<740) tank.style.left = tank.offsetLeft+10+"px";
                }
                break;
            case 32:
                //如果剩余子弹数量大于0发射子弹
                    if(tank.cannon>0) att(tank);
                break;
            //本段仅为敌方坦克设定
            case 0:
                if(isTouch(tank)){
                    go(tank,tank.position);
                }
        }
    }

    //坦克敌人执行上个步骤
    function go(tank,dire){
        switch(dire){
            //上移动
            case 87:
                tank.style.background = "url(./image/"+tank.name+"U.gif)";
                if(tank.offsetTop>0) tank.style.top = tank.offsetTop-10+"px";
                tank.position = 87;
                break;
            //左移动
            case 65:
                tank.style.background = "url(./image/"+tank.name+"L.gif)";
                if(tank.offsetLeft>0)
                tank.style.left = tank.offsetLeft-10+"px";
                tank.position = 65;
                break;
            //下移动
            case 83:
                tank.style.background = "url(./image/"+tank.name+"D.gif)";
                if(tank.offsetTop<540)
                tank.style.top = tank.offsetTop+10+"px";
                tank.position = 83;
                break;
            //右移动
            case 68:
                tank.style.background = "url(./image/"+tank.name+"R.gif)";
                if(tank.offsetLeft<740)
                tank.style.left = tank.offsetLeft+10+"px";
                tank.position = 68;
                break;
        }
    }

    //碰撞检测
    function touch(fixedDiv,moveDiv){
      //获取moveDiv的宽高
      var moveW = moveDiv.offsetWidth;
      var moveH = moveDiv.offsetHeight;
      //获取moveDiv的位置
      var moveL = moveDiv.offsetLeft;
      var moveT = moveDiv.offsetTop;
      //获取fixedDiv的宽高、位置
      var fixedW = fixedDiv.offsetWidth;
      var fixedH = fixedDiv.offsetHeight;
      var fixedL = fixedDiv.offsetLeft;
      var fixedT = fixedDiv.offsetTop;

      var leftType = moveL + moveW >= fixedL;
      var rightType = fixedL + fixedW >= moveL;
      var topType = moveT + moveH >= fixedT;
      var bottomType = fixedT + fixedH >= moveT;

      return leftType && rightType && topType && bottomType;
    }

    //坦克发射子弹攻击
    function att(tank){
        //剩余子弹减1
        if(tank.camp) tank.cannon--;
        //创建子弹对象
        var bullet = document.createElement("img");
        bullet.className = "bullet";
        //为子弹赋阵营
        bullet.camp = tank.camp;
        //子弹只能进行一次碰撞检测
        bullet.touch = 1;
        $("start").appendChild(bullet);
        if(tank.camp) bullet.src = "./image/tankmissile.gif";
        else bullet.src = "./image/enemymissile.gif";
        //为子弹赋初始位置值
        switch (tank.position){
            case 87:
                //坦克顶部初始位置
                var bulletTop = tank.offsetTop-17;
                bullet.style.top = bulletTop+"px";
                //子弹左部初始位置
                var bulletLeft = tank.offsetLeft+tank.offsetWidth/2-7;
                bullet.style.left = bulletLeft+"px";
                //子弹开始移动
                bullet.timer = setInterval(function(){
                    bullet.style.left = bulletLeft+"px";
                    bullet.style.top = bulletTop+"px";
                    bulletTop-=4;
                    //子弹与坦克发生碰撞时
                    if(bullet.touch) isHit(bullet);
                    //子弹超出就清除子弹
                    if(bulletTop<=-17)
                    {
                        clearInterval(bullet.timer);
                        bullet.remove();
                        //剩余子弹加1
                        if(tank.camp){
                            if(tank.cannon<10) tank.cannon++;
                        }
                    }
                },10);
                break;
            case 65:
                //坦克顶部初始位置
                var bulletTop = tank.offsetTop+tank.offsetHeight/2-7;
                bullet.style.top = bulletTop+"px";
                //子弹左部初始位置
                var bulletLeft = tank.offsetLeft-17;
                bullet.style.left = bulletLeft+"px";
                //子弹开始移动
                bullet.timer = setInterval(function(){
                    bullet.style.left = bulletLeft+"px";
                    bullet.style.top = bulletTop+"px";
                    bulletLeft-=4;
                    //子弹与坦克发生碰撞时
                    if(bullet.touch) isHit(bullet);
                    //子弹超出就清除子弹
                    if(bulletLeft<-17)
                    {
                        clearInterval(bullet.timer);
                        bullet.remove();
                        //剩余子弹加1
                        if(tank.camp){
                            if(tank.cannon<10) tank.cannon++;
                        }
                    }
                },10);
                break;
            case 83:
                //坦克顶部初始位置
                var bulletTop = tank.offsetTop+tank.offsetHeight;
                bullet.style.top = bulletTop+"px";
                //子弹左部初始位置
                var bulletLeft = tank.offsetLeft+tank.offsetWidth/2-7;
                bullet.style.left = bulletLeft+"px";
                //子弹开始移动
                bullet.timer = setInterval(function(){
                    bullet.style.left = bulletLeft+"px";
                    bullet.style.top = bulletTop+"px";
                    bulletTop+=4;
                    //子弹与坦克发生碰撞时
                    if(bullet.touch) isHit(bullet);
                    //子弹超出就清除子弹
                    if(bulletTop>600)
                    {
                        clearInterval(bullet.timer);
                        bullet.remove();
                        //剩余子弹加1
                        if(tank.camp){
                            if(tank.cannon<10) tank.cannon++;
                        }
                    }
                },10);
                break;
            case 68:
                //坦克顶部初始位置
                var bulletTop = tank.offsetTop+tank.offsetHeight/2-7;
                bullet.style.top = bulletTop+"px";
                //子弹左部初始位置
                var bulletLeft = tank.offsetLeft+tank.offsetWidth;
                bullet.style.left = bulletLeft+"px";
                //子弹开始移动
                bullet.timer = setInterval(function(){
                    bullet.style.left = bulletLeft+"px";
                    bullet.style.top = bulletTop+"px";
                    bulletLeft+=4;
                    //子弹与坦克发生碰撞时
                    if(bullet.touch) isHit(bullet);
                    //子弹超出就清除子弹
                    if(bulletLeft>800)
                    {
                        clearInterval(bullet.timer);
                        bullet.remove();
                        //剩余子弹加1
                        if(tank.camp){
                            if(tank.cannon<10) tank.cannon++;
                        }
                    }
                },10);
                break;
        }
    }

    //生成随机坦克敌人
    function createTank(){
        for(var i=0;i<tankM.length;i++){
            var span = document.createElement("span");
            span.name = tankM[i];
            span.className = tankM[i];
            span.position = 83;                          //坦克方向
            span.camp = 0;                               //阵营
            span.life = 3;                               //生命
            span.power = 1;                              //子弹威力
            span.blood = 3;                              //坦克血量
            span.condition = 1;                          //坦克状态
            span.cannon = 10;                            //子弹上限
            $("tankEn").appendChild(span);
        }
        //坦克移动
        tankAction();
        change();
    }

    //敌方坦克移动
    function tankAction(){
        var tankD = document.getElementsByTagName("span");
        //坦克一的行为
        tankD[0].timer = setInterval(function(){
            var act = ran(action.length,0);
            tankMove(tankD[0],action[act]);
        },100);
        //坦克二的行为
        tankD[1].timer = setInterval(function(){
            var act = ran(action.length,0);
            tankMove(tankD[1],action[act]);
        },100);
        //坦克三的行为
        tankD[2].timer = setInterval(function(){
            var act = ran(action.length,0);
            tankMove(tankD[2],action[act]);
        },100);
    }

    //子弹与坦克碰撞
    function isHit(bullet){
        var tankD = document.getElementsByTagName("span");
        for(var i=0;i<tankD.length;i++){
            //如果子弹阵营与坦克阵营不同，检测碰撞
            if(bullet.camp!=tankD[i].camp){
                if(touch(bullet,tankD[i])){
                    bullet.touch = 0;
                    //剩余子弹加1
                    if(tankId.cannon<10) tankId.cannon++;
                    //子弹与坦克碰撞掉生命值,并消除子弹
                    tankD[i].blood-=tankId.power;
                    bullet.remove();
                    //当血量降为0时减去一条命，并执行爆炸动画
                    if(tankD[i].blood<=0){
                        clearInterval(bullet.timer);
                        //当坦克状态为活的时候执行爆炸动画
                        if(tankD[i].condition) boom(tankD[i]);
                    }
                }
            }
        }
        //如果子弹阵营与坦克阵营不同，检测碰撞
        if(bullet.camp!=$("tankId").camp){
            var a = touch(bullet,$("tankId"));
            if(a) {
                clearInterval(bullet.timer);
                bullet.remove();
                //执行爆炸动画
                if(tankId.condition) boom($("tankId"));
            }
        }
    }

    //坦克与坦克之间的碰撞
    function isTouch(tank){
        var tankD = document.getElementsByTagName("span");
        //检测玩家坦克与敌对坦克间的碰撞
        if(tank.camp){
            for(var i=0;i<tankD.length;i++){
                if(tankD[i].life>0){
                    //如果坦克碰撞了
                    if(tankTouch(tank,tankD[i])) return false;
                }
            }
        }else{
            //敌方坦克检测与玩家的碰撞
            if(tankTouch(tank,tankId)) return false;
            //检测敌对坦克间的碰撞
            for(var j=0;j<tankD.length;j++){
                for(var k=0;k<tankD.length;k++){
                    if(tankD[j]==tank&&j!=k){
                        if(tankTouch(tank,tankD[k])) return false;
                    }
                }
            }
        }
        return true;
    }

    //坦克碰撞检测
    function tankTouch(fixedDiv,moveDiv){
        //获取moveDiv的宽高
        var moveW = moveDiv.offsetWidth;
        var moveH = moveDiv.offsetHeight;
        //获取moveDiv的位置
        var moveL = moveDiv.offsetLeft;
        var moveT = moveDiv.offsetTop;
        //获取fixedDiv的宽高、位置
        var fixedW = fixedDiv.offsetWidth;
        var fixedH = fixedDiv.offsetHeight;
        var fixedL = fixedDiv.offsetLeft;
        var fixedT = fixedDiv.offsetTop;
        switch(fixedDiv.position){
            case 87: fixedT-=10; break;
            case 65: fixedL-=10; break;
            case 83: fixedT+=10; break;
            case 68: fixedL+=10; break;
        }

        var leftType = moveL + moveW >= fixedL;
        var rightType = fixedL + fixedW >= moveL;
        var topType = moveT + moveH >= fixedT;
        var bottomType = fixedT + fixedH >= moveT;

      return leftType && rightType && topType && bottomType;
    }

    //击中执行爆炸动画
    function boom(tank){
        //爆炸生命减1，坦克状态为死
        if(tank.life>0) --tank.life;
        tank.condition = 0;
        var num = 0;
        //如果是敌对坦克，清除坦克行为动画
        if(!tank.camp) clearInterval(tank.timer);
        //执行爆炸动画
        tank.timer2 = setInterval(function(){
            num++;
            tank.style.background = "url(./image/blast"+num+".png";
            if(num>=4){
                tank.condition = 1;
                clearInterval(tank.timer2);
                //动画执行完成后如果坦克的生命小于等于0，清除坦克
                if(tank.life<=0){
                    if(tank.camp){
                        clearTimer();
                        clearImg();
                        gameOver();
                    }
                    else clearInterval(tank.timer);
                    tank.style.display = "none";
                    var tankD = document.getElementsByTagName("span");
                    //如果所有敌方坦克的生命为0，开始下一关
                    if(tankD[0].life<=0&&tankD[1].life<=0&&tankD[2].life<=0){
                        clearImg();
                        clearInterval(timer);
                        //next();
                        nextDiv();
                    }
                }else{
                    //如果坦克生命大于0，坦克重生
                    tankRelive(tank);
                    change();
                }
            }
        },100);
    }

    //坦克执行重生
    function tankRelive(tank){
        if(tank.camp){
            //玩家坦克重生
            tank.style.top = 540+"px";
            tank.style.left = 370+"px";
            tank.style.background = "url(./image/p1tankU.gif)";
            //重置坦克属性
            tank.power = 1;
            tank.position = 87;
        }else{
            //敌方坦克重生
            tank.position = 83;
            tank.style.top = 0+"px";
            //tank.style.left = ran(740,0)+"px";
            location(tank);
            tank.style.background = "url(./image/"+tank.name+"D.gif";
            //重置坦克属性
            tank.blood = 3;
            tank.timer = setInterval(function(){
                var act = ran(action.length,0);
                tankMove(tank,action[act]);
            },100);
        }
    }

    //敌对坦克重生定位
    function location(tank){
        var j=0;
        var a=[];
        var b=[];
        var temp=0;
        //根据除击毁坦克外所有坦克来进行重生定位
        var tankD = document.getElementsByTagName("span");
        for(var i=0;i<tankD.length;i++){
            if(tank!=tankD[i]){
                a[j]=tankD[i].offsetLeft;
                j++;
            }
        }
        a[j]=tankId.offsetLeft;
        a.sort(function(a,b){
            return a-b;
        });
        b[0] = a[0];
        b[1] = a[1]-a[0]-60;
        b[2] = a[2]-a[1]-60;
        b[3] = 740-a[2];
        var Sumtemp = b[0];
        //选取最大空位进行定位
        for(var k=0;k<4;k++){
            if(Sumtemp<b[k])
            {
                Sumtemp=b[k];
                temp=k;
            }
        }
        if(temp==0) tank.style.left = ran(a[0]-60,0)+"px";
        else if(temp==3) tank.style.left = ran(740,a[2]+60)+"px";
        else tank.style.left = ran(a[temp]-60,a[temp-1]+60)+"px";
    }

    //清除页面上所有定时器
    function clearTimer(){
      var timer1 = setTimeout(function(){
        for(var i=0;i<timer1;i++){
          clearInterval(i);
        }
      },0)
    }

    //添加道具
    function createProp(){
        timer = setInterval(function(){
            //创建道具
            var tool = document.createElement("img");
            tool.className = "tool";
            $("toolCentent").appendChild(tool);
            //为道具创建初始值
            tool.style.top = ran(0,560)+"px";
            tool.style.left = ran(0,760)+"px";
            //五秒后清除道具
            tool.timer = setTimeout(function(){
                tool.remove();
            },5000)
            //判断道具类型
            var p = ran(1,0);
            //为道具对象添加道具类型属性
            tool.t = p;
            //1为手雷，0为星星
            if(p){
                tool.src = "./image/bomb.gif";
            }else{
                tool.src = "./image/star.gif";
            }
        },10000);
    }

    //拾取道具
    function takeProp(tank){
        var tool = $("toolCentent").children;
        for(var i=0;i<tool.length;i++){
            if(touch(tank,tool[i])){
                //道具发动功效
                toolEffect(tool[i]);
                tool[i].remove();
            }
        }
    }

    //道具功效
    function toolEffect(tool){
        if(tool.t){
            var tankD = document.getElementsByTagName("span");
            for(var i=0;i<tankD.length;i++){
                //执行爆炸动画
                if(tankD[i].condition) boom(tankD[i]);
                change();
            }
        }else{
            tankId.power+=1;
            change();
        }
    }

    //用户点击开始，游戏开始
    $("begin").onclick = function(){
        $("start").style.display = "block";
        $("menu").style.display = "none";
        $("statusBar").style.display = "block";
        //当键盘输入W,A,S,D时坦克分别进行上左下右
        document.onkeydown = function(ev){
            if(tankId.condition) tankMove(tankId,ev.keyCode);
            takeProp(tankId);
        }
        //生成敌方坦克
        createTank();
        //生成道具
        createProp();
    }

    //清除页面所有图片
    function clearImg(){
        clearInterval(timer);
        var img = document.getElementsByTagName("img");
        for(var i=0;i<img.length;i++){
            img[i].remove();
        }
    }

    //下一关开始界面
    function nextDiv(){
        $("next").style.display = "block";
        $("start").style.display = "none";
        $("statusBar").style.display = "none";
        $("nextLevel").innerHTML="Level "+levels;
        clearImg();
        $("nextPass").onclick = function(){
            levels++;
            $("next").style.display = "none";
            $("start").style.display = "block";
            $("statusBar").style.display = "block";
            var tankD = document.getElementsByTagName("span");
            for(var i=0;i<tankD.length;i++){
                clearInterval(tankD[i].timer);
            }
            next();
        }
    }

    //下一关
    function next(){
        //clearTimer();
        //清除所有图片
        clearImg();
        //获取敌方坦克对象
        var tankD = document.getElementsByTagName("span");
        //复活所有敌方坦克
        for(var i=0;i<tankD.length;i++){
            //重置所有坦克位置
            tankD[i].style.top = 0+"px";
            tankD[i].style.left = 0+370*i+"px";
            tankD[i].style.background = "url(./image/"+tankD[i].name+"D.gif";
            tankD[i].position = 83;
            tankD[i].style.display = "block";
            tankD[i].life = 3;
            tankD[i].blood = 3;
        }
        //执行敌方坦克移动方法
        tankAction();
        //重置坦克属性
        tankId.power = 1;
        //重置玩家坦克，并生命加1
        tankId.style.top = 540+"px";
        tankId.style.left = 370+"px";
        tankId.style.background = "url(./image/p1tankU.gif)";
        tankId.position = 87;
        tankId.life++;
        createProp();
        change();
    }

    //游戏结束
    function gameOver(){
        clearImg();
        $("start").style.display = "none";
        $("end").style.display = "block";
        $("statusBar").style.display = "none";
        $("play").onclick = function(){
            clearImg();
            $("start").style.display = "block";
            $("end").style.display = "none";
            $("tankId").style.display = "block";
            $("statusBar").style.display = "block";
            //获取敌方坦克对象
            var tankD = document.getElementsByTagName("span");
            //复活所有敌方坦克
            for(var i=0;i<tankD.length;i++){
                //重置所有坦克位置
                tankD[i].style.top = 0+"px";
                tankD[i].style.left = 0+370*i+"px";
                tankD[i].style.background = "url(./image/"+tankD[i].name+"D.gif";
                tankD[i].style.display = "block";
                tankD.position = 83;
                tankD[i].life = 3;
                tankD[i].blood = 3;
            }
            //执行敌方坦克移动方法
            tankAction();
            //重置坦克属性
            tankId.power = 1;
            //重置玩家坦克，并生命加1
            tankId.style.top = 540+"px";
            tankId.style.left = 370+"px";
            tankId.style.background = "url(./image/p1tankU.gif)";
            tankId.position = 87;
            tankId.life=3;
            createProp();
        }
    }

    //参数改变
    function change(){
        $("live").innerHTML = ""+tankId.life;
        $("power").innerHTML = ""+tankId.power;
        var tankD = document.getElementsByTagName("span");
        $("number").innerHTML = tankD[0].life+tankD[1].life+tankD[2].life;
    }
}